<template>
	<view class="logoBox">
		{{ code }}
		<image src="https://www.yongshantuan.cn/images/yongshan/logo.png" mode="" class="logo"></image>
		<view class="telBox"><u-input type="text" placeholder="请输入手机号" v-model="tel" :clearable="false"></u-input></view>
		<!-- <view class="codeBox">
			<u-input type="text" placeholder="验证码 " v-model="code" :clearable="false" :passwordIcon="false"></u-input>
			<view class="getCode" :class="{'dis':hasSendCode}" @click="sendCode">获取验证码<text
					v-if="hasSendCode">({{num}})</text></view>
		</view> -->
		<view class="telBox"><u-input type="password" placeholder="密码" v-model="pass" :clearable="false" :passwordIcon="false"></u-input></view>
		<view class="commenButton" @click="submit">登录</view>
		<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
import { storeLogin, getCode, setOpenId, setOpenIdByCode,getMyInfo } from '@/utils/req/api.js';
import { telReg } from '@/utils/regular.js';
export default {
	data() {
		return {
			hasSendCode: false,
			num: 60,
			timer: '',
			tel: '',
			code: '',
			pass: ''
		};
	},
	onShow() {
		/* let pages = getCurrentPages(), view = pages[pages.length - 1];
		let path = view.route;
		if (path.split('code').length != 1) {
			let code = path
				.split('code')[1]
				.split('&')[0]
				.split('=')[1];
			console.log('-------------------', code);
			this.code = code;
			this.setOpenId({ code });
		} */

		console.log('token', uni.getStorageSync('token'));
		if (uni.getStorageSync('token')) {
			uni.navigateTo({
				url: '/pages/index/index'
			});
		}
	},
	onLoad(options) {
		let { code } = options;
		if (code) {
			uni.setStorageSync('token', code);
			uni.navigateTo({
				url: '/pages/index/index'
			});
		}
	},
	methods: {
		async sendCode() {
			if (!this.tel) {
				this.$showToast.call(this, '请输入手机号', 'warning');
				return;
			}
			if (!telReg.test(this.tel)) {
				this.$showToast.call(this, '请输入正确的手机号', 'warning');
				return;
			}
			if (!this.hasSendCode) {
				let res = await getCode({
					phone: this.tel
				});
				console.log('res', res);
				this.hasSendCode = true;
				this.timer = setInterval(() => {
					this.num = this.num - 1;
					if (this.num == 0) {
						this.num = 60;
						this.hasSendCode = false;
						clearInterval(this.timer);
					}
				}, 1000);
			}
		},
		async submit() {
			let _this = this;
			
			if (!this.tel) {
				this.$showToast.call(this, '请输入手机号', 'warning');
				return;
			}
			if (!telReg.test(this.tel)) {
				this.$showToast.call(this, '请输入正确的手机号', 'warning');
				return;
			}
			if (!this.pass) {
				this.$showToast.call(this, '请输入密码', 'warning');
				return;
			}
			// if (!this.code) {
			// 	this.$showToast.call(this, '请输入验证码', 'warning')
			// 	return;
			// }
			let res = await storeLogin({
				phone: this.tel,
				// smsCode:this.code
				pass: this.pass
			});
			console.log('登录res', res);
			if (res.data.code == 500) {
				this.$showToast.call(this, res.data.message || '登录失败', 'warning');
				return;
			}
			let token = res.data.result.token;
			
			if (res.data.success) {
				uni.setStorageSync('token', token);		// 先保存，确保后面的请求生效
				if (res.data.result.openId) {
					this.$showToast.call(this, '登录成功');
					uni.navigateTo({
						url: '../index/index'
					});
				} else {
					uni.login({
					  success:(res1)=>{
						let code = res1.code;
						console.log('res1.code:', code);
						_this.setOpenIdByCode({code: code}, token)
						
						// 成功获取，一定要appid，secret对应上
						/* let appid = 'wx7280e609bff3da8f';
						let secret = 'aabbcc';
						return;
						wx.request({
						  url: `https://api.weixin.qq.com/sns/jscode2session?appid=${appid}&secret=${secret}&js_code=${code}&grant_type=authorization_code`,
						  success:(res2)=>{
							  let data = res2.data;
							  console.log(data);
							  if (data.openid) {
								  // 成功
								_this.setOpenIdByCode({openId: data.openid})
							  } else {
								  _this.$showToast.call(_this, '获取openId失败', 'warning');
							  }
						  },
						  fail(err) {
							  _this.$showToast.call(_this, '获取openId失败', 'warning');
						  },
						}) */
						
						
					  },
					  fail: (err) => {
						  _this.$showToast.call(_this, err.errMsg, 'warning');
					  }
					  
					})
					
					// 没有openid，需要获取并保存openId;
					// window.location.href =
						// 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx50c118fbe2e4490f&response_type=code&scope=snsapi_base&state=abcdefghigklmnopqrstuvwxyz&redirect_uri=https://merchant.yongshantuan.cn/#wechat_redirect';
				}
			} else {
				this.$showToast.call(this, res.data.message, 'warning');
			}
		},
		async setOpenId(code) {
			let res = await setOpenId(code);
			console.log('res', res);
			if (res.success) {
				this.submit();
			}
		},
		// 保存openid
		async setOpenIdByCode(code, token) {
			let _this = this;
			let res = await setOpenIdByCode(code);
			console.log('setOpenIdByCode res:', res);
			if (res.data.success) {
				this.$showToast.call(this, '登录成功');
				uni.navigateTo({
					url: '../index/index'
				});
			} else {
				_this.$showToast.call(_this, '获取openId失败');
			}
		}
	},
	onUnload() {
		clearInterval(this.timer);
	}
};
</script>

<style lang="scss" scoped>
.logoBox {
	@include flexs(center, center);
	flex-direction: column;
	min-height: 100vh;
	padding: 0 40rpx;

	.logo {
		width: 150rpx;
		height: 150rpx;
		margin-bottom: 50rpx;
	}

	.telBox,
	.codeBox {
		width: 100%;
		margin: 20rpx 0;
		background-color: #ececec;
		border-radius: 100rpx;
		padding: 5rpx 0;
	}

	.codeBox {
		position: relative;

		.getCode {
			position: absolute;
			right: 0;
			top: 0;
			font-size: 28rpx;
			line-height: 28rpx;
			min-width: 30%;
			max-width: 50%;
			height: 100%;
			@include flexs(center, center);
			color: #fa690a;
			padding-right: 20rpx;
		}

		.dis {
			color: rgba(0, 0, 0, 0.35);
		}
	}

	.commenButton {
		padding: 20rpx 0;
		background-color: #fa690a;
		margin-top: 40rpx;
	}
}
</style>
<style lang="scss">
.telBox,
.codeBox {
	.u-input {
		border: 1px solid red;
		border-color: rgba(0, 0, 0, 0) !important;
		text-indent: 40rpx;
		color: rgba(0, 0, 0, 0.35);
		line-height: 2;
		font-size: 28rpx !important;
	}

	/deep/ .u-input__input {
		font-size: 28rpx;
		padding-left: 24px;
		text-indent: 0px;
	}
}

.codeBox {
	.u-input {
		width: 50%;
	}
}
</style>
